<template>
	<el-dialog title="日志详情" :visible.sync="visible" append-to-body top="0" width="992px">
		<el-descriptions size="medium" class="system_log_detail" border :label-style="labelStyle">
			<el-descriptions-item label="操作用户">{{ data.createAccount }} / {{ data.ipAddr }}</el-descriptions-item>
			<el-descriptions-item label="模块名称">{{ data.moduleName }}</el-descriptions-item>
			<el-descriptions-item label="请求方式" :content-style="{ width: '80px' }">
				<el-tag size="small" :type="data.requestType | requestTypeFilter">{{ data.requestType }}</el-tag>
			</el-descriptions-item>
			<el-descriptions-item label="请求地址">{{ data.actionUrl }}</el-descriptions-item>
			<el-descriptions-item label="操作方法" :span="2">{{ data.classPath }}</el-descriptions-item>
			<el-descriptions-item label="请求参数" :span="3">{{ data.requestParam }}</el-descriptions-item>
			<el-descriptions-item label="操作状态">
				<el-tag size="small" :type="data.level | operateTypeFilter">{{ data.level | operateNameFilter }}</el-tag>
			</el-descriptions-item>
			<el-descriptions-item label="操作时间">{{ data.startTime }}</el-descriptions-item>
		</el-descriptions>
		<template slot="footer">
			<el-button size="medium" @click="visible = false">关闭</el-button>
		</template>
	</el-dialog>
</template>

<script>
import { getLogEnumList, getLogPageList } from '@/api/system/tbSysLog';
export default {
	props: {
		value: { type: Boolean, default: false },
		data: { type: Object, default: () => {} }
	},
	data() {
		return {
			visible: this.value,
			labelStyle: { width: '80px' }
		};
	},
	filters: {
		requestTypeFilter(input) {
			return input === 'POST' ? 'success' : '';
		},
		operateTypeFilter(input) {
			if (input === '1') {
				return 'success';
			} else if (input === '2') {
				return 'danger';
			} else {
				return 'info';
			}
		},
		operateNameFilter(input) {
			if (input === '1') {
				return '成功';
			} else if (input === '2') {
				return '错误';
			} else {
				return '其他';
			}
		}
	},
	watch: {
		value(flag) {
			this.visible = flag;
		},
		visible(flag) {
			this.$emit('input', flag);
		}
	}
};
</script>

<style lang="scss" scoped>
.system_log_detail {
	width: 100%;
	height: 100%;
}
</style>
